/*
* 1. toolbar 생성.
* 2. 툴바에 아이템으로 기본 요소인 button 생성.
*          iconMask = 마스크 추가로 아이콘 보이도록 하기.
* 3. 탭바에 items 추가.  
*/
Ext.setup({
   tabletStartupScreen:"./tabletStartupScreen.png",
   phoneStartupScreen:"./phoneStartupScreen.png",
   tabletIcon:"./tabletIcon.png",
   phoneIcon:"./phoneIcon.png",
   glossOnIcon: true,
   statusBarStyle:"black",
   fullscreen:true,
   preloadImages:[],
   scope:this,
   onReady: function() {
	   
       var tab = new Ext.TabPanel({
           fullscreen: true,  
           id: 'content',
           scroll:"vertical", 
           title:"Tabpanel test",  
           dockedItems: [{
                   xtype: 'toolbar',
                   ui: 'light',
                   dock: 'top',
                   title:"Icon Test 2"
               }, {
                   xtype: 'toolbar',
                   ui: 'light',
                   dock: 'top',
                   defaults: {
                       iconMask: true,
                       ui: 'plain',
                       handler:function(b,e) {
                           Ext.Msg.alert('Title', '선택된 아이콘.'+b.iconCls, Ext.emptyFn);
                       }
                   },
                   scroll: {
                       direction: 'horizontal',
                       // 스크롤 바가 나오지 않도록
                       useIndicators: false
                   },
                   layout: {
                       pack: 'center'
                   },
                   items: [{
                       iconCls: 'action',
                       ui:"normal"
                   }, {
                       iconCls: 'add'
                   }, {
                       iconCls: 'arrow_up',
                       ui:"action"
                   }, {
                       iconCls: 'arrow_right'
                   }, {
                       iconCls: 'arrow_down'
                   }, {
                       iconCls: 'arrow_left',
                       ui:"round"
                   }, {
                       iconCls: 'compose'
                   }, {
                       iconCls: 'delete'
                   }, {
                       iconCls: 'refresh'
                   }, {
                       iconCls: 'reply'
                   }, {
                       iconCls: 'search'
                   }, {
                       iconCls: 'star'
                   }, {
                       iconCls: 'home'
                   }, {
                       iconCls: 'locate'
                   }, {
                       iconCls: 'maps'
                   }, {
                       iconCls: 'trash'
                   }]
               }, {
            	   xtype: 'toolbar',
                   ui: 'light',
                   dock: 'top',
                   defaults: {
                       iconMask: true,
                       ui: 'plain',
                       handler:function(b, e) {
                    	   Ext.getCmp('content').update(b.title);
                    	   //Ext.Msg.alert('Title', b.iconCls, Ext.emptyFn);
//                           Ext.Msg.alert('Title', '선택된 아이콘.'+ b.iconCls, Ext.emptyFn);
                       }
                   },
                   scroll: {
                       direction: 'horizontal',
                       // 스크롤 바가 나오지 않도록
                       useIndicators: false
                   },
                   layout: {
                       pack: 'center'
                   },
                   items: [{
                       iconCls: 'bookmarks',
                       title: 'Both Bookmarks',
                       cls : 'card1',
                       html : 'Book Marks'
                   }, {
                	   iconCls : 'download',
                	   title : 'Download',
                	   cls : 'card2',
                	   html : 'Pressed Download'
                   }, {
                	   iconCls : 'favorites',
                	   title : 'Favorites',
                	   cls : 'card3',
                	   html : 'Pressed Favorites'
                   }, {
                	   iconCls : 'info',
                	   title : 'Info',
                	   cls : 'card4',
                	   html : 'Pressed Info'
                   }, {
                	   iconCls : 'more',
                	   title : 'More',
                	   cls : 'card5',
                	   html : 'Pressed More'
                   }, {
                	   iconCls : 'search',
                	   title : 'Search',
                	   cls : 'card6',
                	   html : 'Pressed Search'
                   }, {
                	   iconCls : 'settings',
                	   title : 'Settings',
                	   cls : 'card7',
                	   html : 'Pressed Settings'
                   }, {
                	   iconCls : 'team',
                	   title : 'Team',
                	   cls : 'card8',
                	   html : 'Pressed Team'
                   }, {
                	   iconCls : 'time',
                	   title : 'Time',
                	   cls : 'card9',
                	   html : 'Pressed Time'
                   }, {
                	   iconCls : 'user',
                	   title : 'User',
                	   cls : 'card10',
                	   html : 'Pressed User'
                   } ]
               } ]
       })
	}
});